<template>
  <div>
    <div class="crumbs">
      <el-breadcrumb separator="/">
        <el-breadcrumb-item><i class="el-icon-lx-calendar"></i> {{title}}</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="container">
      <div class="form-box">
        <el-form ref="form" :model="form" label-width="80px">
          <el-form-item label="博客名称">
            <el-input v-model="form.i_title"></el-input>
          </el-form-item>
          <el-form-item label="副标题">
            <el-input v-model="form.i_subtitle"></el-input>
          </el-form-item>
          <el-form-item label="关于我们">
            <quill-editor ref="myTextEditor" v-model="form.i_about" :options="editorOption"></quill-editor>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="onSubmit">提交</el-button>
            <el-button>取消</el-button>
          </el-form-item>
        </el-form>
      </div>
    </div>

  </div>
</template>

<script>
  import 'quill/dist/quill.core.css';
  import 'quill/dist/quill.snow.css';
  import 'quill/dist/quill.bubble.css';
  import { quillEditor } from 'vue-quill-editor';
export default {
    data(){
        return{
            title: this.$route.meta.title,
            form:{
                i_title:"",
                i_subtitle:"",
                i_about:""
            },
            editorOption: {
                placeholder: 'Hello World'
            },
             adminId:localStorage.getItem('adminId'),
        }
    },
    components: {
      quillEditor
    },
    created(){
      this.getData()
    },
    methods:{
       
        getData(){
            this.$axios.get("/info/all").then(res=>{
              let infoarr=[]
              infoarr = res.data.filter(item=>item.user_info==this.adminId)
              this.form = infoarr[0]
            })
        },
        onSubmit(){
            this.$axios.put('/info/update',this.form).then(res=>{
                this.$message({
                            type:"success",
                            message:"添加信息成功"
                })
                
            })
        }
    }
}
</script>

<style scoped>
.container{
      padding: 20px;
      background: #fff;
      margin: 10px;
  }
  .crumbs{
      margin: 10px;
  }
</style>